<template>
  <div class="audition256">
    <p>1. 使用纯组件</p>
    <p>2. 在合适的地方使用useMemo。 <a href="https://zhuanlan.zhihu.com/p/355108967" target="_blank">使用方法</a></p>
    <p>3. 路由懒加载。<a href="https://blog.csdn.net/weixin_43342105/article/details/105553032" target="_blank">三种方式</a></p>
    <p>4. 使用Fragments以避免额外标记</p>
    <p>5. 尽量不要使用内联函数定义，而是在组件中单独定义函数，把函数名交给事件</p>
    <p>6. 避免使用内联样式属性</p>
    <p>7. 优化条件渲染，避免组件频繁的挂载和卸载</p>
    <p>8. 列表渲染时要添加key</p>
    <p>9. 高频触发事件时，可以添加防抖和节流</p>
    <p>10. 插件按需加载</p>
    <p>11. 数据较多时，可以使用虚拟列表优化显示数据</p>
    <p>12. 根据需要，在useEffect中添加[]</p>
    <p>13. 及时清理定时器等副作用</p>
    <p>14. 对不需要高频切换显示的组件，可以使用组件懒加载</p>
    <p>15. 避免数据结构突变</p>
    <p>参考阅读：<a href="https://blog.csdn.net/React_Community/article/details/123516459" target="_blank">优化1</a></p>
    <p>参考阅读：<a href="https://blog.csdn.net/weixin_44283432/article/details/123518995" target="_blank">优化2</a></p>
  </div>
</template>

<script>
export default {
  name: 'Audition256'
}
</script>

<style>

</style>